<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/aui.css"/>
    <title>详情-买入</title>

    <style type="text/css">
        body,
        html {
            overflow-x: hidden;
            background-color: #f5f5f5 !important;
        }

        header {
            color: #FFFFFF;
            background: -webkit-linear-gradient(left top, #0F9BEB, #1569C8);
            /* Safari 5.1 - 6.0 */
            background: -o-linear-gradient(bottom right, #0F9BEB, #1569C8);
            /* Opera 11.1 - 12.0 */
            background: -moz-linear-gradient(bottom right, #0F9BEB, #1569C8);
            /* Firefox 3.6 - 15 */
            background: linear-gradient(to bottom right, #0F9BEB, #1569C8);
            background: -webkit-linear-gradient(left top, #0F9BEB, #1569C8);
            /* 标准的语法*/
            box-shadow: 0 0px 7px #0c5ebb;
        }

        .aui-bar-nav {
            top: 0;
            line-height: 2.2rem !important;
            background-color: #03a9f4;
            color: #ffffff;
            padding: 1rem 0 0 0 !important;
        }

        .aui-bar-nav .aui-pull-left {
            padding: 0;
            margin: 0 0.75rem 0 0px;
        }

        .aui-list-view-cell {
            line-height: 22px;
        }

        li.aui-list-item.li-mairu {
            height: 2.25rem !important;
        }

        .aui-checkbox:checked {
            background-color: #1569c8 !important;
            border: solid 1px #1569c8 !important;
            text-align: center;
            background-clip: padding-box;
        }

        span.btImg {
            width: 1.1rem;
            height: 1.1rem;
            background: url(../../image/btn/setting_hlgl@2x.png) no-repeat;
            background-size: 1.1rem;
            background-position: center;
        }

        li.aui-list-item.li-mairu {
            border-bottom: 0.05rem #f5f5f5;
            padding-left: 0.75rem !important;
            margin-left: 0 !important;
        }

        input.aui-pull-right.aui-checkbox.aui-checkbox-info {
            margin-right: 0.35rem !important;
            overflow: hidden;
        }

        .aui-radio,
        .aui-checkbox {
            width: 0.65rem;
            height: 0.65rem;
            overflow: hidden;
        }

        span.btName {
            margin-left: 0.3rem;
            font-size: 0.7rem !important;
            color: #000000 !important;
        }

        span {
            display: inline-block;
            float: left;
        }

        label {
            overflow: hidden;
        }

        footer {
            position: fixed;
            bottom: 0;
            width: 100%;
            height: 2.45rem;
            line-height: 2.45rem;
            background-color: #fff;
        }

        .botBtn {
            margin: 0 0.75rem;
            overflow: hidden;
        }

        .select {
            float: right;
            color: #333333 !important;
        }

        .botBtn span {
            font-size: 0.8rem;
            /*color: #1569C8 !important;*/
            color: #999999;
            margin: 0 1.15rem !important;
        }

        .aui-radio:checked:before,
        .aui-radio.aui-checked:before,
        .aui-checkbox:checked:before,
        .aui-checkbox.aui-checked:before,
        .aui-radio:checked:after,
        .aui-radio.aui-checked:after,
        .aui-checkbox:checked:after,
        .aui-checkbox.aui-checked:after {
            content: '';
            width: 0.65rem;
            height: 0.45rem;
            position: absolute;
            top: 45%;
            left: 45%;
            margin-left: -0.35rem;
            border: 1px solid #FFFFFF;
            margin-top: -0.5rem;
        }

        .aui-radio,
        .aui-checkbox {
            background-color: #ffffff;
            border: solid 1px #999999;
        }

        .aui-radio:checked,
        .aui-radio.aui-checked,
        .aui-checkbox:checked,
        .aui-checkbox.aui-checked {
            background-color: #fff;
        }

        .aui-bar-nav .aui-title {
            min-height: 2.2rem !important;
        }

        .aui-bar-nav .aui-btn {
            height: 2.2rem !important;
            line-height: 2.2rem !important;
        }

        .aui-icon-left:before {
            content: none !important;
        }

        .aui-icon-left {
            width: 1.1rem !important;
            height: 1.1rem !important;
            background-image: url("../../image/nav_back@2x.png");
            background-size: 1.1rem !important;
            background-repeat: no-repeat !important;
            font-size: 0.9rem !important;
            line-height: 1.2rem !important;
            padding: 0 !important;
            margin: 0 0 0 0.75rem !important;
            color: #ffffff;
        }

        .aui-list-item-inner {
            position: relative;
            overflow: hidden;
            min-height: 2.2rem;
            line-height: 2.2rem;
            padding-right: 0.75rem;
        }

        span.moreList {
            display: inline-block;
            width: 1.1rem !important;
            height: 1.1rem !important;
            background-image: url("../../image/setting_more@2x.png");
            background-size: 1.1rem !important;
            background-repeat: no-repeat;
            background-position: center;
        }

        label.aui-input-addon {
            position: absolute;
            left: 1.5rem !important;
        }
    </style>

</head>

<body>
<header class="aui-bar aui-bar-nav">
    <a class="aui-pull-left aui-btn" href="../set/set.html">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title">编辑</div>
    <!--<a class="aui-pull-right aui-btn a-wc-btn" onclick="openSharebox()">
        <span class="span-wc-btn">保存</span>
    </a>-->
</header>

<section class="aui-content">
    <ul class="aui-list more-ul" id="moreUl">

        <!--<li class="aui-list-item li-mairu">-->
        <!--<div class="aui-list-item-inner">-->
        <!--<span><input class="aui-pull-left aui-checkbox aui-checkbox-info" type="checkbox"></span>-->
        <!--<label class="aui-input-addon">-->
        <!--<span class="btImg"></span>-->
        <!--<span class="btName">BTC(Coin)</span>-->
        <!--<span class="btWalet">,钱包</span>-->
        <!--</label>-->
        <!--<span class="aui-iconfont aui-icon-left moreList"></span>-->
        <!--</div>-->
        <!--</li>-->
        <!--<li class="aui-list-item li-mairu">-->
            <!--<div class="aui-list-item-inner">-->
                <!--<span><input class="aui-pull-left aui-checkbox aui-checkbox-info" type="checkbox"></span>-->
                <!--<label class="aui-input-addon">-->
                    <!--<span class="btImg"></span>-->
                    <!--<span class="btName">BTC(Coin)</span>-->
                    <!--<span class="btWalet">,钱包</span>-->
                <!--</label>-->
                <!--<span class="aui-iconfont aui-icon-left moreList"></span>-->
            <!--</div>-->
        <!--</li>-->

        <!--第二列表 Start-->
    </ul>
</section>
<footer>
    <div class="botBtn">
        <span class="delect">删除</span>
        <span class="select">全选</span>
    </div>
</footer>

</body>
<script src="../../script/api.js" type="text/javascript" charset="utf-8"></script>
<script src="../../script/tool.js" type="text/javascript" charset="utf-8"></script>
<script src="../../jquery-2.1.3.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
  var arr = []

  var bizhichanList = JSON.parse(localStorage.getItem('bizhichanList')) || [];

  $(document).ready(function () {

    if (!bizhichanList || bizhichanList.length == 0) {
      $("#moreUl").append('<li class="noDateNotes"> 暂无可编辑</li>')
    } else {
      for (let i = 0; i < bizhichanList.length; i++) {
        var tokenName = bizhichanList[i].tokenName + "(" + bizhichanList[i].AbbreviationName + ")";
        $("#moreUl").append(
          `<li class="aui-list-item li-mairu">
        <div class="aui-list-item-inner">
        <span><input class="aui-pull-left aui-checkbox aui-checkbox-info" type="checkbox"></span>
        <label class="aui-input-addon">
        <span class="btImg"></span>
        <span class="btName">${tokenName}</span>
        <span class="btWalet"></span>
        </label>
        <span class="aui-iconfont aui-icon-left moreList"></span>
        </div>
        </li>`
        )

      }
    }
  })

  //  全选与取消
  var isCheckAll = false;

  function swapCheck() {
    if (isCheckAll) {
      $("input[type='checkbox']").each(function () {
        this.checked = false;
        $(".delect").css("color", "#999999");
        $(".select").css("color", "#999999");
      });
      isCheckAll = false;

    } else {
      $("input[type='checkbox']").each(function () {
        this.checked = true;
        $(".delect").css("color", "#0062CC");
        $(".select").css("color", "#000000");
      });
      isCheckAll = true;
    }
  }

  //  删除函数
  $(function () {
    delectSelect();
  });

  function delectSelect() {
    $(".delect").click(function () {
      $("input[name='list']:checked").each(function () { // 遍历选中的checkbox
        n = $(this).parents("li").index(); // 获取checkbox所在行的顺序
        $("ul#moreUl").find("li:eq(" + n + ")").remove();
        bizhichanList.splice(n, 1);
      });
      localStorage.setItem('bizhichanList', JSON.stringify(bizhichanList));
      $(".delect").css("color", "#999999");
      localStorage.removeItem('tokenName');
      localStorage.removeItem('sum');
      localStorage.removeItem('priceIpt');
    });
  }


  function checked1(index) {
    for (let i = 0; i < arr.length; i++) {
      if (arr[i] == index) {
        arr.splice(i, 1);
        $("input[type='checkbox']")[0].checked ? $('.delect').css('color', '#1569c8') : $('.delect').css('color', '#999999')
        return;
      }
    }
    $("input[type='checkbox']")[0].checked ? $('.delect').css('color', '#1569c8') : $('.delect').css('color', '#999999')
    arr.push(index);
  }
</script>

</html>